<template>
    <el-card>
      <menu-nav :list="navList"></menu-nav>

      <div class='app-container' v-if=' 1==1' :loading='loading'>
        <div class='tip-div' v-if="user_exam_info.page_tip_enable=='enabled'">
          <div class='tip-content'>
            <span style="white-space: pre-line;" v-html="user_exam_info.page_tip"></span>
          </div>

        </div>
        <el-form ref="form"  :model="form" label-width="120px">
          <el-row >
            <el-col :span="16">
              <el-form-item  style='width:100%;' label="考试名称">
                <el-input   v-model='user_exam_info.examname' :disabled="true"></el-input>
                <el-input type="hidden" v-model="form.examid" class="input-hidden"></el-input>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row >
            <el-col :span="16">
              <el-form-item  style='width:100%;' label="报考单位">
                <el-select v-model="form.unitid"  style='width:100%;' @change='getCareerList()' filterable placeholder="请选择">
                    <el-option
                      v-for="(sub_item, sub_index) in unitList"
                      :key="sub_index"
                      :label="sub_item.name"
                      :value="sub_item.id">
                    </el-option>
                  </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row >
            <el-col :span="16">
              <el-form-item  style='width:100%;' label="报考岗位">
                <el-select v-model="form.careerid"  style='width:100%;' filterable placeholder="请选择">
                    <el-option
                      v-for="(sub_item, sub_index) in careerList"
                      :key="sub_index"
                      :label="sub_item.name"
                      :value="sub_item.id">
                    </el-option>
                  </el-select>
              </el-form-item>
            </el-col>

          </el-row>

          <el-form-item>
            <el-button type="primary" :disabled='user_exam_info.edit_enable == "disabled"' @click="onSubmit">提交审核</el-button>
            <el-button>取消</el-button>
          </el-form-item>
        </el-form>

      </div>
      <el-empty  v-else description="暂未开放"></el-empty>

    </el-card>



</template>

<script>
import {formatTime} from '@/utils/index'
import http from '@/utils/http'
import api from '@/api_kaowu'
  export default {
    name: 'review',
    props:['user_exam_info'],
    filters: {
        timeFilter(timestamp) {
        return formatTime(timestamp, '{y}-{m}-{d} {h}:{i}', true)
        },
    },
    data () {
      return {
          navList: [
            { label: '提交审核', href: '/personal/kaowu/review', name: '/personal/kaowu/review', active: true },
          ],
          loading:true,
          unitList:[],
          careerList:[],
          form: {
             examid:null,
             unitid:null,
             careerid:null,
          },

      }
    },
    created () {
      this.init()
    },

    methods:{
        onSubmit() {
          const insertData = { ...this.form }

          if(!this.form.unitid){
            this.$message.error('请选择报考单位');
            return;
          }
          if(!this.form.careerid){
            this.$message.error('请选择报考岗位');
            return;
          }

          http.post(api.submitReview,insertData)
              .then(res => {
                this.$message.success(res.message)
                if(res.code  == 200){
                  this.user_exam_info.edit_enable = 'disabled';
                }


              })
              .catch(err => {
                  console.log(err)
              })

        },
        // 初始化数据
        init() {
            this.form.examid = this.user_exam_info.exam_id
            console.log(this.user_exam_info)
            if(this.user_exam_info.enroll_uuid == 'enabled'){
              if(this.user_exam_info.unit_id){
                this.form.unitid = this.user_exam_info.unit_id
              }
              if(this.user_exam_info.career_id){
                this.form.careerid = this.user_exam_info.career_id
              }
              this.getCareerList();
            }

            this.getUnitList();
        },

        getUnitList(){
          var that = this
          var request = {
            examid:that.form.examid,
          }
          http.post(api.unitList,request)
              .then(res => {
                  that.unitList = res.data
              })
        },

        getCareerList(){
          var that = this;
          var request = {
            examid:that.form.examid,
            unitid:that.form.unitid
          }
          http.post(api.careerList,request)
              .then(res => {
                that.careerList = res.data

              })
        }



    }
  }
</script>

<style lang="scss" scoped>
  .tip-div{padding:15px;background-color: #fafafa;width: 100%;min-height: 80px;line-height:20px;border-left:5px solid red;margin-bottom:30px;}
  .tip-content{
    white-space:pre-wrap;
    color:red;
    font-size:16px;
    line-height:24px;
  }
  .input-hidden {
        position: absolute;
    }
  .app-container{background:#fff;overflow:auto;}
  .avatar-uploader .el-upload {
      border: 1px dashed #d9d9d9;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
      border-color: #409EFF;
    }
    .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      line-height: 178px;
      text-align: center;
    }
    .avatar {
      width: 178px;
      height: 178px;
      display: block;
    }
</style>
